
let perpetualContractObserver = null

import { perpetualTradeInfo } from './perpetualTrade.js'
import { perpetualBottomTabs } from '@/content-scripts/watch/trading/perpetualTrade.js'
import { getElement } from '@/content-scripts/getElement.js'

export function createPerpetualContract() {
    perpetualBottomTabs()

    console.log('createPerpetualContract');
    if (perpetualContractObserver) perpetualContractObserver.disconnect();
    let previousValues = {
        positionValue: null,
        tabsTypeValue: null
    };
    perpetualContractObserver = new MutationObserver(() => {
        const positionBtn = getElement("perpetual.trade.positionBtn")[0]

        const tabsBtnGroup = getElement("perpetual.trade.tabsBtnGroup")[0]

        const tabsBtn = getElement("perpetual.trade.tabsBtn", tabsBtnGroup)[0]


        // console.log(tradeTopType, 'rrrrrrrrrrrrrr');
        // console.log(tradeTopType.innerHTML, 'rrrrrrrrrrrrrr');

        const hasChanged =
            positionBtn.innerHTML !== previousValues.positionValue ||
            tabsBtn.innerHTML !== previousValues.tabsTypeValue

        if (positionBtn && tabsBtn && hasChanged) {
            previousValues = {
                positionValue: positionBtn.innerHTML,
                tabsTypeValue: tabsBtn.innerHTML
            }
            perpetualTradeInfo(previousValues)
            // Tranoverage(previousValues)
        }
    });
    perpetualContractObserver.observe(document.body, {
        childList: true,
        subtree: true,
        attributes: true,
        characterData: true,
    });
}